<template>
  <div class="footer-box center">
    <img
      :src="item.src"
      alt=""
      class="mr-[5px]"
      v-for="(item, index) in imgList"
      :key="index"
    />
  </div>
</template>

<script setup lang="ts">
const imgList = ref([
  { src: "https://img.shields.io/badge/-Vue3-34495e?logo=vue.js" },
  { src: "https://img.shields.io/badge/nuxt3-34495e" },
  {
    src: "https://img.shields.io/badge/-JavaScript-yellow?logo=javascript&logoColor=white",
  },
  { src: "https://img.shields.io/badge/php-red" },
  { src: "https://img.shields.io/badge/naiveUi-8A2BE2" },
]);
</script>

<style scoped lang="less">
.footer-box {
  border-top: 1px solid #f1f1f1;
  padding: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 40px;
}
</style>
